<!-- Copyright (c) 2014 The Chromium Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file. -->

<link rel="import" href="cr-diff-message.html">

<polymer-element name="cr-diff-messages" attributes="beforeMessages afterMessages file">
    <template>
        <link rel="stylesheet" href="../common/common.css">
        <style>
            :host {
                display: block;
            }

            cr-diff-message {
                background-color: #ffd;
                border-bottom: 1px solid #dcdcdc;
            }

            cr-diff-message:last-child {
                border-bottom: none;
            }
        </style>

        <div>
            <div id="before">
                <template repeat="{{ message in beforeMessages }}">
                    <cr-diff-message message="{{ message }}"></cr-diff-message>
                </template>
            </div>
            <div id="after">
                <template repeat="{{ message in afterMessages }}">
                    <cr-diff-message message="{{ message }}"></cr-diff-message>
                </template>
            </div>
        </div>
    </template>
    <script>
        Polymer({
            created: function() {
                this.beforeMessages = [];
                this.afterMessages = [];
                this.file = null;
            },
        });
    </script>
</polymer-element>
